
.container{
    width: 1400px;
    height: 2100px;
    position: relative;
    text-align: center;
    margin:120px auto;
    /* z-index: -1; */
    padding: 40px auto;
    border:30px solid #5d7ba79a;
    background-image: url(sen.jpg);
    background-attachment: scroll;
    box-shadow:4px 4px 4px #747992;
   
}

.one{
    
    width: 1400px;
    height: 550px;
    position: absolute;
    left: 0.5px;
    top:0px;
    text-align: center;
    /* z-index: -1; */
    }
 .hezi{
        background-image: url(lu.jpg);
        width: 800px;
        height: 350px;
        box-shadow:4px 4px 4px rgb(39, 49, 65);
        border-radius: 120px;
       animation-name:move;
       animation-timing-function: linear;
       animation-iteration-count: infinite;
       animation-duration: 4s;
       animation-direction: alternate;
       /* z-index: -1; */
 }
    .hezi:hover{
        animation-play-state: paused;
    }
        @keyframes move {
            0% {
                transform: translate(0, 0);
            }
            25% {
                transform: translate(100px, 100px);
            }
            50% {
                transform: translate(200px, 0px);
                background-color:rgb(30, 47, 66);
            }
            75% {
                transform: translate(300px, 100px);
            }
            100% {
                transform: translate(400px, 0px);
            }
                
 }
 .hezi h1{
 color: #c6d8ecf5;
 text-align: center;
 position: absolute;
 left: 80px;
 top: 10px;
 font-size: 90px;
 /* z-index: -1; */
}
.nav{
 width: 1400px;
 height: 100px;
 background-color: #ffffff57;
 text-align: center;
 position: absolute;
 top: 700px;
 /* z-index: -1; */
 }
 .ziwo a{
     width: 100px;
     height: 40px;
     border-radius: 10px;
     background-color: #424c6de5;
     position: absolute;
     left: 450px;
     top: 30px;
     text-decoration: none;
     color: white;
     transition: all 1.5s;
 }
 .ziwo a:hover{
     transform: scale(2);
 }
 .zuopin a{
     width: 100px;
     height: 40px;
     border-radius: 10px;
     background-color: #424c6dec;
     position: absolute;
     left: 850px;
     top: 30px;
     text-decoration: none;
     color: white;
     transition: all 1.5s;
 }
 .zuopin a:hover{
     transform: scale(2);
 }
.two{
    width: 1400px;
    height: 250px;
    background-color: rgba(27, 33, 82, 0.678);
    position: absolute;
    left: 0px;
    top: 900px;
    /* z-index: -1; */
    text-align: center;
}

.tou{
    position: absolute;
    left: 70px;
    bottom: 15px;
   text-align: center;
    width: 200px;
    height: 200px;
    border-radius: 100px;
    /* z-index: -1; */
    margin:10px auto;
    border:1px solid #050508;
    overflow: hidden;
    transition: all 1s;
    cursor: pointer;
}
.tou:hover{
    transform: scale(1);
}
.ren{
    width: 200px;
    height: 200px;
    border-radius: 100px;
    transition: all 3s;
    cursor: pointer;
}
.ren:hover{
 transform: rotate(360deg);
    box-shadow:0 0 10px #747992;
}
.two h2{
    color: white;
    width: 350px;
    height: 200px;
    line-height: 26px;
    font-size:25px;
    letter-spacing: 0.1em;
    /* z-index: -1; */
    position: absolute;
    left: 390px;
    top: 0px;
   text-align: center;
   transition: all 1.5s;
}
.two h2:hover{
    transform: scale(1.5);
    box-shadow:0 0 10px #484f72;
}
.two P{
    position: absolute;
    /* z-index: -1; */
    left: 400px;
    top: 100px;
    width: 600px;
    height: 100px;
    border-radius:140px ;
    text-align: left;
    font-size: 20px;
    color: #ffffff;
    transition: all 1.5s;
}
.two p:hover{
    transform: scale(1.5);
}
.work{
    background-color: #304469b2;
    width: 1400px;
    height: 650px;
    position: absolute;
    left: 0px;
    bottom: 200px;
    /* z-index: -1; */
    text-align: center;
}
    .first {
        text-align: center;
        position: absolute;
        left: 40px;
        bottom: 100px;
        /* z-index: -1; */
        transition: all 1s;
        cursor: pointer;
 }
    .first:hover{
        /* animation-play-state: paused;  */
        transform:scale(1.5); 
    }
     .second {
        text-align: center;
        position: absolute;
        left: 450px;
        bottom: 200px;
      transition: all 1.5s;
    }
    .second:hover{
        transform: scale(1.5);
    }
    .third {
        text-align: center;
        position: absolute;
        left: 800px;
        bottom: 10px;
       transition: all 1.5s;
    }
    .third:hover{
        transform: scale(1.5);
    }
    .fourth {
        text-align: center;
        position: absolute;
        right: 10px;
        bottom: 200px;
        transition: all 1.5s;
    }
    .fourth:hover{
        transform: scale(1.5);
    }
    .work h3{
        color: #ffffff;
        text-align: center;
        position: absolute;
        left: 10px;
        top: 10px;
        font-size: 25px;
       transition: all 1.5s;
    }
    .work h3:hover{
        transform: scale(1.5);
    }
    .work p{
        color: white;
      text-align: center;
        position: absolute;
        left: 10px;
        top: 100px;
        font-size: 15px;
        transition: all 1.5s;
    }
    .work p:hover{
        transform: scale(1.5);  
    }
.foot{
    background-color: #454980b0;
    width: 1400px;
    height: 150px;
    /* z-index: -1; */
    text-align: center;
    position: absolute;
    left:0px ;
    bottom:0px;
} 

.tu{
   width: 100px;
   height: 100px;
   position: absolute;
   left: 80px;
   bottom: 20px;
   transition: all 1.5s; 
  text-align: center;
}
.tu:hover{
    transform: scale(1.5);    
}
.foot h4{
    color: white;
 text-align: center;
    position: absolute;
    left:450px;
    top: 10px;
    font-size: 20px;
    transition: all 1.5s; 
}
.foot h4:hover{
    transform: scale(1.5); 
 }
.foot p{
    color: white;
    text-align: center;
    font-size: 15px;
    position: absolute;
    top: 60px;
   left: 550px;
   transition: all 1.5s; 
}
.foot p:hover{
    transform: scale(1.5);
  }
.rainmp3{
    width: 0;
    height: 0;
    volume: 0 34;
}
